[V0_FILE]plaintext:file=".gitignore" isMerged="true" # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies /node_modules # next.js /.next/ /out/ # production /build # debug npm-debug.log* yarn-debug.log* yarn-error.log* .pnpm-debug.log* # env files .env* # vercel .vercel # typescript *.tsbuildinfo next-env.d.ts [V0_FILE]markdown:file="README.md" isMerged="true" # Gislaved moske apps *Automatically synced with your [v0.dev](https://v0.dev) deployments* [![Deployed on Vercel](https://img.shields.io/badge/Deployed%20on-Vercel-black?style=for-the-badge&logo=vercel)](https://vercel.com/marr4ever69-gmailcoms-projects/v0-gislaved-moske-apps) [![Built with v0](https://img.shields.io/badge/Built%20with-v0.dev-black?style=for-the-badge)](https://v0.dev/chat/projects/TB1zHl8Qwb9) ## Overview This repository will stay in sync with your deployed chats on [v0.dev](https://v0.dev). Any changes you make to your deployed app will be automatically pushed to this repository from [v0.dev](https://v0.dev). ## Deployment Your project is live at: **[https://vercel.com/marr4ever69-gmailcoms-projects/v0-gislaved-moske-apps](https://vercel.com/marr4ever69-gmailcoms-projects/v0-gislaved-moske-apps)** ## Build your app Continue building your app on: **[https://v0.dev/chat/projects/TB1zHl8Qwb9](https://v0.dev/chat/projects/TB1zHl8Qwb9)** ## How It Works 1. Create and modify your project using [v0.dev](https://v0.dev) 2. Deploy your chats from the v0 interface 3. Changes are automatically pushed to this repository 4. Vercel deploys the latest version from this repository [V0_FILE]typescriptreact:file="app/admin/page.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" import { ControlPanel } from "@/components/control-panel" import { Button } from "@/components/ui/button" import { useRouter } from "next/navigation" export default function AdminPage() { const [settings, setSettings] = useState(null) const [loading, setLoading] = useState(true) const router = useRouter() useEffect(() => { // In a real app, you would fetch settings from an API or localStorage // For now, we'll use localStorage const savedSettings = localStorage.getItem("prayerTimesSettings") if (savedSettings) { setSettings(JSON.parse(savedSettings)) } else { setSettings({}) // Default settings will be applied in the ControlPanel } setLoading(false) }, []) const handleSaveSettings = (newSettings: any) => { // In a real app, you would save to an API // For now, we'll use localStorage localStorage.setItem("prayerTimesSettings", JSON.stringify(newSettings)) setSettings(newSettings) alert("Settings saved successfully!") } const handleViewDisplay = () => { router.push("/") } if (loading) { return

} return (

Prayer Times Display Admin

) } [V0_FILE]typescript:file="app/fonts.ts" isMerged="true" import { Amiri } from "next/font/google" export const amiri = Amiri({ weight: ["400"], subsets: ["arabic"], display: "swap", variable: "--font-amiri", }) [V0_FILE]css:file="app/globals.css" isMerged="true" @tailwind base; @tailwind components; @tailwind utilities; html, body { font-size: 16px; } @media screen and (min-width: 640px) { html, body { font-size: 18px; } } @media screen and (min-width: 1024px) { html, body { font-size: 20px; } } @media screen and (min-width: 1920px) { html, body { font-size: 24px; } } .font-arabic { font-family: var(--font-amiri), Arial, sans-serif; direction: rtl; unicode-bidi: embed; } .glass-morphism { background: rgba(0, 0, 0, 0.45); backdrop-filter: blur(8px); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2); } [dir="rtl"] { text-align: right; } body { margin: 0; padding: 0; } @keyframes scrollLtr { from { transform: translateX(100%); } to { transform: translateX(-100%); } } @keyframes scrollRtl { from { transform: translateX(-100%); } to { transform: translateX(100%); } } .animate-scroll-ltr { animation: scrollLtr 30s linear infinite; } .animate-scroll-rtl { animation: scrollRtl 30s linear infinite; } @keyframes scroll { 0% { transform: translateY(100%); } 100% { transform: translateY(-100%); } } .animate-scroll { animation: scroll linear infinite; } /* Additional styles for TV display */ .tv-container { max-width: 1920px; margin: 0 auto; } .tv-text { font-size: 1.5rem; } .tv-text-large { font-size: 2rem; } .tv-text-xl { font-size: 2.5rem; } .tv-clock { font-size: 4rem; } .tv-prayer-times { font-size: 1.75rem; } .tv-quran-verse { font-size: 2.5rem; line-height: 1.4; } /* Pulsing glow effect for next prayer */ @keyframes glow { 0% { box-shadow: 0 0 5px 2px rgba(255, 255, 0, 0.3); } 50% { box-shadow: 0 0 15px 5px rgba(255, 255, 0, 0.5); } 100% { box-shadow: 0 0 5px 2px rgba(255, 255, 0, 0.3); } } .next-prayer-glow { animation: glow 2s ease-in-out infinite; } /* Adding animations for Laylat al-Qadr notification */ @keyframes bounce-slow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .animate-bounce-slow { animation: bounce-slow 3s ease-in-out infinite; } @keyframes float { 0%, 100% { transform: translateY(0) rotate(0deg); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateY(-100vh) rotate(360deg); opacity: 0; } } .animate-float { animation: float 8s ease-in-out infinite; } [V0_FILE]typescriptreact:file="app/layout.tsx" isMerged="true" import type React from "react" import "./globals.css" import { amiri } from "./fonts" import Script from "next/script" export const metadata = { title: "Gislaved Moske TV", description: "Prayer times and Islamic teachings display for Gislaved Mosque", manifest: "/manifest.json", themeColor: "#10b981", viewport: { width: "device-width", initialScale: 1, maximumScale: 1, userScalable: false, }, appleWebApp: { capable: true, statusBarStyle: "black-translucent", title: "Mosque TV", }, generator: 'v0.app' } export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( {children} ) } [V0_FILE]typescriptreact:file="app/mob.tsx" isMerged="true" "use client" import { useState, useEffect, useMemo } from "react" import { Clock } from "@/components/clock" import { NextPrayerCountdown } from "@/components/next-prayer-countdown" import { DailyPrayers } from "@/components/daily-prayers" import { AnimatedLine } from "@/components/animated-line" import { fetchPrayerTimes } from "@/lib/prayer-api" import type { DailyPrayers as DailyPrayersType } from "@/types/prayer" const backgrounds = [ "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_121993204_O6NoYVBQsFOheCIyvuvwAQwgNUeZ3hPH.jpg-qNH8TcuRMPfTA7OdMuVy07fvTNPUdq.jpeg", // Mosque with sunset through archway "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_88704793_j9c6F80ZlTS3kzN4aLSUKbNfMtu7BVnk.jpg-p29tcYbX0qk5DxN1BcgWsPkH5280HH.jpeg", // Dome of the Rock with golden dome "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_108650165_VkBBsgQtt753eql5ucrkh70pS2zciDI4.jpg-q1wSDvlhDxLUZ5G7IdTLeFPWaKLF1O.jpeg", // Mosque interior with colorful stained glass "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_59776174_Jx1ykrcGaU8rdLeIO1SnZ1bU3KOTbSOl.jpg-ccLHa1MpaL8cwrwmVAP7a2EHbsIbwO.jpeg", // Dome of the Rock in winter with snow "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_77204123_GQ5JEQmEyDkBkh6DrmbO3vxIgpikPVvW.jpg-PqClmqgs3mZfxEyTl0ANLNHMT5ue7K.jpeg", // Mosque corridor with repeating arches "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_140716699_q6DTGIsmDw8hGelwte5LMXWlRPUABLos.jpg-cGs9eOBEEhBhWKTxlz2d1YdLdlDFyJ.jpeg", // Koutoubia Mosque minaret with palm trees "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_144922029_Ak7uzS5wiX7cJ8B6TvCHxDC7RHvDaD7b.jpg-VwNh8F17E2g3YY4fRBmnmr720fEkWb.jpeg", // Blue Mosque interior with ornate decorations "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_173443100_Sm0a0ZNvvGEbV6N17bOUqHUFOqiBsPGB.jpg-3C4gUdgYecUNG4q8ijMwhX22vb2b3G.jpeg", // Blue Mosque at sunset with birds "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_149360210_Hr1Y5rT9hE0mNVFQ90hVThR79Udn707E.jpg-Pr9zrjLmwoWA1uZbMluhxWaTQK2zbj.jpeg", // Mystical night scene with crescent moon "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_126014946_yFCC1zed1S3iWLVdooMeuoZOlESjhKyW.jpg-9yoOtUEgtAEPAzlg6Yd5eX0dccN6Bi.jpeg", // Blue Mosque interior dome architecture ] export default function MobilePage() { const [currentBgIndex, setCurrentBgIndex] = useState(0) const [prayerTimes, setPrayerTimes] = useState(null) const [error, setError] = useState(null) useEffect(() => { const now = new Date() const minutesSinceMidnight = now.getHours() * 60 + now.getMinutes() // Change to 15-minute intervals instead of 30 const initialIndex = Math.floor(minutesSinceMidnight / 15) % backgrounds.length setCurrentBgIndex(initialIndex) // Calculate minutes to next 15-minute mark const minutesToNext15 = 15 - (minutesSinceMidnight % 15) const msToNext15 = minutesToNext15 * 60 * 1000 const initialTimeout = setTimeout(() => { setCurrentBgIndex((prevIndex) => (prevIndex + 1) % backgrounds.length) // Change interval to 15 minutes (900000 ms) const interval = setInterval(() => { setCurrentBgIndex((prevIndex) => (prevIndex + 1) % backgrounds.length) }, 900000) // 15 minutes return () => clearInterval(interval) }, msToNext15) return () => clearTimeout(initialTimeout) }, []) useEffect(() => { const fetchData = async () => { try { const data = await fetchPrayerTimes(new Date()) setPrayerTimes(data) setError(null) } catch (error) { console.error("Failed to fetch prayer times:", error) setError("Could not load prayer times. Using fallback data.") setPrayerTimes(await fetchPrayerTimes(new Date())) } } fetchData() const interval = setInterval(fetchData, 60 * 60 * 1000) // Refresh every hour return () => clearInterval(interval) }, []) const backgroundStyle = useMemo( () => ({ backgroundImage: `linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.6)), url('${backgrounds[currentBgIndex]}')`, backgroundSize: "cover", backgroundPosition: "center", }), [currentBgIndex], ) return (

{error &&

{error}

}

) } [V0_FILE]typescriptreact:file="app/page.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" import { TVDisplay } from "@/components/tv-display" const backgrounds = [ "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_121993204_O6NoYVBQsFOheCIyvuvwAQwgNUeZ3hPH.jpg-qNH8TcuRMPfTA7OdMuVy07fvTNPUdq.jpeg", // Mosque with sunset through archway "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_88704793_j9c6F80ZlTS3kzN4aLSUKbNfMtu7BVnk.jpg-p29tcYbX0qk5DxN1BcgWsPkH5280HH.jpeg", // Dome of the Rock with golden dome "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_108650165_VkBBsgQtt753eql5ucrkh70pS2zciDI4.jpg-q1wSDvlhDxLUZ5G7IdTLeFPWaKLF1O.jpeg", // Mosque interior with colorful stained glass "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_59776174_Jx1ykrcGaU8rdLeIO1SnZ1bU3KOTbSOl.jpg-ccLHa1MpaL8cwrwmVAP7a2EHbsIbwO.jpeg", // Dome of the Rock in winter with snow "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_77204123_GQ5JEQmEyDkBkh6DrmbO3vxIgpikPVvW.jpg-PqClmqgs3mZfxEyTl0ANLNHMT5ue7K.jpeg", // Mosque corridor with repeating arches "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_140716699_q6DTGIsmDw8hGelwte5LMXWlRPUABLos.jpg-cGs9eOBEEhBhWKTxlz2d1YdLdlDFyJ.jpeg", // Koutoubia Mosque minaret with palm trees "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_144922029_Ak7uzS5wiX7cJ8B6TvCHxDC7RHvDaD7b.jpg-VwNh8F17E2g3YY4fRBmnmr720fEkWb.jpeg", // Blue Mosque interior with ornate decorations "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_173443100_Sm0a0ZNvvGEbV6N17bOUqHUFOqiBsPGB.jpg-3C4gUdgYecUNG4q8ijMwhX22vb2b3G.jpeg", // Blue Mosque at sunset with birds "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_149360210_Hr1Y5rT9hE0mNVFQ90hVThR79Udn707E.jpg-Pr9zrjLmwoWA1uZbMluhxWaTQK2zbj.jpeg", // Mystical night scene with crescent moon "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/240_F_126014946_yFCC1zed1S3iWLVdooMeuoZOlESjhKyW.jpg-9yoOtUEgtAEPAzlg6Yd5eX0dccN6Bi.jpeg", // Blue Mosque interior dome architecture ] export default function Home() { const [currentBgIndex, setCurrentBgIndex] = useState(0) useEffect(() => { const now = new Date() const minutesSinceMidnight = now.getHours() * 60 + now.getMinutes() // Change to 15-minute intervals instead of 30 const initialIndex = Math.floor(minutesSinceMidnight / 15) % backgrounds.length setCurrentBgIndex(initialIndex) // Calculate minutes to next 15-minute mark const minutesToNext15 = 15 - (minutesSinceMidnight % 15) const msToNext15 = minutesToNext15 * 60 * 1000 const initialTimeout = setTimeout(() => { setCurrentBgIndex((prevIndex) => (prevIndex + 1) % backgrounds.length) // Change interval to 15 minutes (900000 ms) const interval = setInterval(() => { setCurrentBgIndex((prevIndex) => (prevIndex + 1) % backgrounds.length) }, 900000) // 15 minutes return () => clearInterval(interval) }, msToNext15) return () => clearTimeout(initialTimeout) }, []) return (

) } [V0_FILE]css:file="app/prevent-sleep.css" isMerged="true" @keyframes preventSleepAnimation { 0% { opacity: 0.001; } 100% { opacity: 0.002; } } .prevent-sleep { position: fixed; top: 0; left: 0; width: 1px; height: 1px; opacity: 0.001; pointer-events: none; z-index: -1; animation: preventSleepAnimation 5s infinite alternate; } [V0_FILE]json:file="components.json" isMerged="true" { "$schema": "https://ui.shadcn.com/schema.json", "style": "default", "rsc": true, "tsx": true, "tailwind": { "config": "tailwind.config.ts", "css": "app/globals.css", "baseColor": "neutral", "cssVariables": true, "prefix": "" }, "aliases": { "components": "@/components", "utils": "@/lib/utils", "ui": "@/components/ui", "lib": "@/lib", "hooks": "@/hooks" }, "iconLibrary": "lucide" } [V0_FILE]typescriptreact:file="components/analog-clock.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" export function AnalogClock() { const [time, setTime] = useState(new Date()) useEffect(() => { const timer = setInterval(() => setTime(new Date()), 1000) return () => clearInterval(timer) }, []) const seconds = time.getSeconds() * 6 const minutes = time.getMinutes() * 6 + seconds / 60 const hours = ((time.getHours() % 12) / 12) * 360 + minutes / 12 // Adjust the size to match other components const clockSize = 200 const centerPoint = clockSize / 2 return (

{/* Clock numbers */} {[...Array(12)].map((_, i) => { const angle = ((i + 1) * 30 * Math.PI) / 180 - Math.PI / 2 const radius = clockSize * 0.4375 const x = Math.cos(angle) * radius + centerPoint const y = Math.sin(angle) * radius + centerPoint return (

{i + 1}

) })} {/* 24-hour numbers */} {[...Array(12)].map((_, i) => { const angle = ((i + 1) * 30 * Math.PI) / 180 - Math.PI / 2 const radius = clockSize * 0.359375 const x = Math.cos(angle) * radius + centerPoint const y = Math.sin(angle) * radius + centerPoint return (

{i + 13}

) })} {/* Red dots */} {[...Array(12)].map((_, i) => { const angle = (i * 30 * Math.PI) / 180 - Math.PI / 2 const radius = clockSize * 0.484375 const x = Math.cos(angle) * radius + centerPoint const y = Math.sin(angle) * radius + centerPoint return (

) })} {/* Clock hands */}

{/* Center dot */}

{/* Digital time */}

{time.toLocaleTimeString("sv-SE", { hour: "2-digit", minute: "2-digit" })}

) } [V0_FILE]typescriptreact:file="components/animated-line.tsx" isMerged="true" "use client" import { useState, useEffect, useCallback } from "react" import { PhoneOff } from "lucide-react" import type { DailyPrayers } from "@/types/prayer" // Update the messages array to include more translations and make them more futuristic const messages = [ { lang: "ar", text: "أغلق هاتفك المحمول. احترم بيت الله. التزم الصمت أثناء الأذان.", color: "text-red-500" }, { lang: "en", text: "Turn off your mobile phone. Respect the house of Allah. Remain silent during the call to prayer.", color: "text-white", }, { lang: "sv", text: "Stäng av din mobiltelefon. Respektera Allahs hus. Var tyst under böneutropet.", color: "text-yellow-500", }, { lang: "so", text: "Demi mobilkaaga. Ixtiraam guriga Allah. Aamusnow inta lagu jiro adaanka.", color: "text-green-500", }, ] // Add a new function to check if it's after Iqama time const isAfterIqama = (prayerTimes: DailyPrayers | null): boolean => { if (!prayerTimes) return false const now = new Date() const currentTime = now.getHours() * 60 + now.getMinutes() const iqamaTimes = { Fajr: 10, Dhuhr: 10, Asr: 7, Maghrib: 5, Isha: 7, } for (const prayer of prayerTimes.prayers) { if (prayer.name === "Sunrise") continue const [hours, minutes] = prayer.time.split(":").map(Number) const prayerTime = hours * 60 + minutes const iqamaTime = prayerTime + iqamaTimes[prayer.name as keyof typeof iqamaTimes] // Check if we're within 15 minutes after Iqama if (currentTime >= iqamaTime && currentTime <= iqamaTime + 15) { return true } } return false } interface AnimatedLineProps { className?: string prayerTimes: DailyPrayers | null } export function AnimatedLine({ className = "", prayerTimes }: AnimatedLineProps) { const [currentIndex, setCurrentIndex] = useState(0) const [showMessage, setShowMessage] = useState(false) const updateIndex = useCallback(() => { setCurrentIndex((prevIndex) => (prevIndex + 1) % messages.length) }, []) useEffect(() => { if (!prayerTimes) return const checkPrayerTimes = () => { const now = new Date() const currentTime = now.getHours() * 60 + now.getMinutes() const shouldShow = prayerTimes.prayers.some((prayer) => { const [hours, minutes] = prayer.time.split(":").map(Number) const prayerTime = hours * 60 + minutes return currentTime >= prayerTime - 15 && currentTime <= prayerTime + 20 }) || isAfterIqama(prayerTimes) setShowMessage(shouldShow) } checkPrayerTimes() const interval = setInterval(checkPrayerTimes, 60000) // Check every minute return () => clearInterval(interval) }, [prayerTimes]) useEffect(() => { const interval = setInterval(updateIndex, 20000) // Change message every 20 seconds return () => clearInterval(interval) }, [updateIndex]) // Removed the condition if (!showMessage) return null; return (

{messages[currentIndex].text}

) } [V0_FILE]typescriptreact:file="components/arabic-adhkar-display.tsx" isMerged="true" "use client" import { useState, useEffect, useRef } from "react" interface ArabicAdhkarDisplayProps { onClose: () => void prayerName?: string } // Pure Arabic adhkar only const pureArabicAdhkar = [ "أَعُوْذُ بِاللّٰهِ مِنَ الشَّيْطَانِ الرَّجِيْمِ", "بِسْمِ اللّٰهِ الرَّحْمٰنِ الرَّحِيْمِ", "اَللّٰهُ لَآ إِلٰهَ إِلَّا هُوَ الْحَىُّ الْقَيُّوْمُ لَا تَأْخُذُهُۥ سِنَةٌ وَّلَا نَوْمٌ لَهُ مَا فِى السَّمٰـوٰتِ وَمَا فِى الْأَرْضِ مَنْ ذَا الَّذِىْ يَشْفَعُ عِنْدَهُ إِلَّا بِإِذْنِهِۦ يَعْلَمُ مَا بَيْنَ أَيْدِيْهِمْ وَمَا خَلْفَهُمْ وَلَا يُحِيْطُوْنَ بِشَىْءٍ مِّنْ عِلْمِهِٓ إِلَّا بِمَا شَآءَ وَسِعَ كُرْسِيُّهُ السَّمٰـوٰتِ وَالْأَرْضَ وَلَا يَئُوْدُهُۥ حِفْظُهُمَا وَهُوَ الْعَلِىُّ الْعَظِيْمُ", "قُلْ هُوَ اللّٰهُ أَحَدٌ اَللّٰهُ الصَّمَدُ لَمْ يَلِدْ وَلَمْ يُوْلَدْ وَلَمْ يَكُنْ لَّهُ كُفُوًا أَحَدٌ", "قُلْ أَعُوْذُ بِرَبِّ الْفَلَقِ مِنْ شَرِّ مَا خَلَقَ وَمِنْ شَرِّ غَاسِقٍ إِذَا وَقَبَ وَمِنْ شَرِّ النَّفَّاثَاتِ فِي الْعُقَدِ وَمِنْ شَرِّ حَاسِدٍ إِذَا حَسَدَ", "قُلْ أَعُوْذُ بِرَبِّ النَّاسِ مَلِكِ النَّاسِ إِلٰهِ النَّاسِ مِنْ شَرِّ الْوَسْوَاسِ الْخَنَّاسِ اَلَّذِيْ يُوَسْوِسُ فِيْ صُدُوْرِ النَّاسِ مِنَ الْجِنَّةِ وَالنَّاسِ", "أَسْتَغْفِرُ اللهَ أَسْتَغْفِرُ اللهَ أَسْتَغْفِرُ اللهَ", "اَللّٰهُمَّ أَنْتَ السَّلَامُ وَمِنْكَ السَّلَامُ تَبَارَكْتَ يَا ذَا الْجَلَالِ وَالْإِكْرَامِ", "سُبْحَانَ اللّٰهِ وَالْحَمْدُ لِلّٰهِ وَاللّٰهُ أَكْبَرُ", "لَا إِلٰهَ إِلَّا اللّٰهُ وَحْدَهُ لَا شَرِيْكَ لَهُ لَهُ الْمُلْكُ وَلَهُ الْحَمْدُ وَهُوَ عَلَىٰ كُلِّ شَيْءٍ قَدِيْرٌ", "اَللّٰهُمَّ أَعِنِّيْ عَلَىٰ ذِكْرِكَ وَشُكْرِكَ وَحُسْنِ عِبَادَتِكَ", "اَللّٰهُمَّ إِنِّيْ أَعُوْذُ بِكَ مِنَ الْبُخْلِ وَأَعُوْذُ بِكَ مِنَ الْجُبْنِ وَأَعُوْذُ بِكَ مِنْ أَنْ أُرَدَّ إِلَىٰ أَرْذَلِ الْعُمُرِ وَأَعُوْذُ بِكَ مِنْ فِتْنَةِ الدُّنْيَا وأَعُوْذُ بِكَ مِنْ عَذَابِ الْقَبْرِ", "اَللّٰهُمَّ إِنِّيْ أَسْأَلُكَ عِلْمًا نَافِعًا وَرِزْقًا طَيِّبًا وَعَمَلًا مُتَقَبَّلًا", "سُبْحَانَ الْمَلِكِ الْقُدُّوْسِ سُبْحَانَ الْمَلِكِ الْقُدُّوْسِ سُبْحَانَ الْمَلِكِ الْقُدُّوْسِ", ] export function ArabicAdhkarDisplay({ onClose, prayerName = "" }: ArabicAdhkarDisplayProps) { const [currentIndex, setCurrentIndex] = useState(0) const timerRef = useRef(null) const startTime = useRef(Date.now()) useEffect(() => { // Duration: 5 minutes for regular prayers, 15 minutes for Jumu'ah const totalDuration = prayerName === "Jumu'ah" ? 15 * 60 * 1000 : 5 * 60 * 1000 const intervalTime = Math.floor(totalDuration / pureArabicAdhkar.length) // Rotate through adhkar timerRef.current = setInterval(() => { setCurrentIndex((prev) => { const next = (prev + 1) % pureArabicAdhkar.length // Check if time is up if (Date.now() - startTime.current >= totalDuration) { if (timerRef.current) clearInterval(timerRef.current) setTimeout(onClose, 500) return prev } return next }) }, intervalTime) // Auto close after duration const closeTimer = setTimeout(() => { if (timerRef.current) clearInterval(timerRef.current) onClose() }, totalDuration) return () => { if (timerRef.current) clearInterval(timerRef.current) clearTimeout(closeTimer) } }, [onClose, prayerName]) return (

أذكار بعد الصلاة

{pureArabicAdhkar[currentIndex]}

) } [V0_FILE]typescriptreact:file="components/athan-animation.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" interface AthanAnimationProps { prayerName: string onClose: () => void } const athanWords = [ { arabic: "ٱللَّٰهُ أَكْبَرُ", transliteration: "Allāhu akbar", repeat: 4 }, { arabic: "أَشْهَدُ أَن لَّا إِلَٰهَ إِلَّا ٱللَّٰهُ", transliteration: "ašhadu al lā ilāha illā -llāh", repeat: 2 }, { arabic: "أَشْهَدُ أَنَّ مُحَمَّدًا رَسُولُ ٱللَّٰهِ", transliteration: "ašhadu anna Muḥammadar rasūlu -llāhi", repeat: 2 }, { arabic: "حَيَّ عَلَى ٱلصَّلَاةِ", transliteration: "ḥayya alā ṣ-ṣalāh", repeat: 2 }, { arabic: "حَيَّ عَلَى ٱلْفَلَاحِ", transliteration: "ḥayya alā l-falāḥ", repeat: 2 }, { arabic: "ٱلصَّلَاةُ خَيْرٌ مِنَ ٱلنَّوْمِ", transliteration: "aṣ-ṣalātu khayrun mina n-nawm", repeat: 2, onlyForFajr: true }, { arabic: "ٱللَّٰهُ أَكْبَرُ", transliteration: "Allāhu akbaru", repeat: 2 }, { arabic: "لَا إِلَٰهَ إِلَّا ٱللَّٰهُ", transliteration: "lā ilāha illā -llāh", repeat: 1 }, ] export function AthanAnimation({ prayerName, onClose }: AthanAnimationProps) { const [currentWordIndex, setCurrentWordIndex] = useState(0) const [currentRepeat, setCurrentRepeat] = useState(1) useEffect(() => { const timer = setInterval(() => { setCurrentRepeat((prev) => { if (prev < athanWords[currentWordIndex].repeat) { return prev + 1 } else { setCurrentWordIndex((prevIndex) => { if (prevIndex === athanWords.length - 1) { clearInterval(timer) setTimeout(onClose, 1000) // Close after the last word return prevIndex } if (athanWords[prevIndex + 1].onlyForFajr && prayerName !== "Fajr") { return prevIndex + 2 } return prevIndex + 1 }) return 1 } }) }, 5000) // Change word every 5 seconds return () => clearInterval(timer) }, [currentWordIndex, prayerName, onClose]) const currentWord = athanWords[currentWordIndex] return (

Athan for {prayerName}

{currentWord.arabic}

{currentWord.transliteration}

) } [V0_FILE]typescriptreact:file="components/clock-and-countdown.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" import { NextPrayerCountdown } from "@/components/next-prayer-countdown" import type { DailyPrayers } from "@/types/prayer" interface ClockAndCountdownProps { prayerTimes: DailyPrayers | null } export function ClockAndCountdown({ prayerTimes }: ClockAndCountdownProps) { const [time, setTime] = useState(new Date()) useEffect(() => { const timer = setInterval(() => setTime(new Date()), 900) return () => clearInterval(timer) }, []) const formatDate = (date: Date) => { return date.toLocaleDateString("sv-SE", { weekday: "long", year: "numeric", month: "long", day: "numeric", }) } const formatHijriDate = (hijriDate: string) => { return hijriDate.split(" ").reverse().join(" ") } return (

{time.toLocaleTimeString("sv-SE", { hour: "2-digit", minute: "2-digit" })} :{time.getSeconds().toString().padStart(2, "0")}

{formatDate(time)}

{prayerTimes && (

{formatHijriDate(prayerTimes.hijriDate)}

)}

) } [V0_FILE]typescriptreact:file="components/clock.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" import { fetchHijriDate, type HijriDate } from "@/lib/hijri-api" export function Clock() { const [time, setTime] = useState(new Date()) const [hijriDate, setHijriDate] = useState(null) const [isLoading, setIsLoading] = useState(true) useEffect(() => { const timer = setInterval(() => setTime(new Date()), 1000) return () => clearInterval(timer) }, []) // Fetch Hijri date once when component mounts useEffect(() => { const getHijriDate = async () => { try { setIsLoading(true) const today = new Date() const swedenToday = new Date(today.toLocaleString("en-US", { timeZone: "Europe/Stockholm" })) const hijri = await fetchHijriDate(swedenToday) setHijriDate(hijri) console.log("[v0] Hijri date loaded:", hijri) } catch (error) { console.error("[v0] Failed to fetch Hijri date:", error) setHijriDate({ day: "15", month: "Jumada al-Akhirah", year: "1447", arabicDay: "١٥", arabicMonth: "جمادى الآخرة", arabicYear: "١٤٤٧", fullArabic: "١٥ جمادى الآخرة ١٤٤٧", }) } finally { setIsLoading(false) } } getHijriDate() // Refresh Hijri date at midnight const now = new Date() const swedenNow = new Date(now.toLocaleString("en-US", { timeZone: "Europe/Stockholm" })) const tomorrow = new Date(swedenNow) tomorrow.setDate(tomorrow.getDate() + 1) tomorrow.setHours(0, 0, 0, 0) const msUntilMidnight = tomorrow.getTime() - swedenNow.getTime() const midnightTimer = setTimeout(() => { getHijriDate() // Set up daily refresh const dailyTimer = setInterval(getHijriDate, 24 * 60 * 60 * 1000) return () => clearInterval(dailyTimer) }, msUntilMidnight) return () => clearTimeout(midnightTimer) }, []) const formatDate = (date: Date) => { return date.toLocaleDateString("sv-SE", { weekday: "long", year: "numeric", month: "long", day: "numeric", }) } return (

{/* Mobile: Stack vertically */}

{time.toLocaleTimeString("sv-SE", { hour: "2-digit", minute: "2-digit" })} :{time.getSeconds().toString().padStart(2, "0")}

{formatDate(time)}

{isLoading ? ( Loading Hijri date... ) : hijriDate ? ( {hijriDate.fullArabic} ) : ( Hijri date unavailable )}

{/* TV/PC: Show in one horizontal line */}

{/* Digital Clock */}

{time.toLocaleTimeString("sv-SE", { hour: "2-digit", minute: "2-digit" })} :{time.getSeconds().toString().padStart(2, "0")}

{/* Separator */}

{/* Gregorian Date */}

{formatDate(time)}

{/* Separator */}

{/* Hijri Date */}

{isLoading ? ( Loading Hijri date... ) : hijriDate ? ( {hijriDate.fullArabic} ) : ( Hijri date unavailable )}

) } [V0_FILE]typescriptreact:file="components/control-panel.tsx" isMerged="true" "use client" import { useState } from "react" import { Button } from "@/components/ui/button" import { Label } from "@/components/ui/label" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" import { Switch } from "@/components/ui/switch" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" import { Slider } from "@/components/ui/slider" import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card" interface ControlPanelProps { onSave: (settings: any) => void initialSettings?: any } export function ControlPanel({ onSave, initialSettings = {} }: ControlPanelProps) { const [settings, setSettings] = useState({ textSpeed: initialSettings.textSpeed || 8, textSize: initialSettings.textSize || "medium", showFridaySpecial: initialSettings.showFridaySpecial !== false, showEidSpecial: initialSettings.showEidSpecial !== false, showRamadanSpecial: initialSettings.showRamadanSpecial !== false, iqamaTimes: initialSettings.iqamaTimes || { Fajr: 10, Dhuhr: 10, "Jumu'ah": 15, Asr: 7, Maghrib: 5, Isha: 7, }, languages: initialSettings.languages || { arabic: true, swedish: true, somali: true, albanian: true, }, ...initialSettings, }) const handleChange = (key: string, value: any) => { setSettings((prev) => ({ ...prev, [key]: value, })) } const handleIqamaChange = (prayer: string, value: number) => { setSettings((prev) => ({ ...prev, iqamaTimes: { ...prev.iqamaTimes, [prayer]: value, }, })) } const handleLanguageChange = (language: string, enabled: boolean) => { setSettings((prev) => ({ ...prev, languages: { ...prev.languages, [language]: enabled, }, })) } const handleSave = () => { onSave(settings) } return ( Prayer Times Display Control Panel Customize the display settings for the prayer times TV General Iqama Times Languages Special Days

Text Scrolling Speed (seconds)

handleChange("textSpeed", value[0])} className="flex-1" /> {settings.textSpeed}s

Text Size

{Object.entries(settings.iqamaTimes).map(([prayer, minutes]) => (

{prayer} Iqama Delay (minutes)

handleIqamaChange(prayer, value[0])} className="flex-1" /> {minutes}m

))}

Arabic handleLanguageChange("arabic", checked)} />

Swedish handleLanguageChange("swedish", checked)} />

Somali handleLanguageChange("somali", checked)} />

Albanian handleLanguageChange("albanian", checked)} />

Show Friday Special Content handleChange("showFridaySpecial", checked)} />

Show Eid Special Content handleChange("showEidSpecial", checked)} />

Show Ramadan Special Content handleChange("showRamadanSpecial", checked)} />

) } [V0_FILE]typescriptreact:file="components/daily-prayers.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" import type { DailyPrayers as DailyPrayersType } from "@/types/prayer" import { Sun, Sunrise, SignalHigh as SunHigh, Sunset, Moon } from "lucide-react" interface DailyPrayersProps { prayerTimes: DailyPrayersType | null } export function DailyPrayers({ prayerTimes }: DailyPrayersProps) { const [nextPrayer, setNextPrayer] = useState(null) const [isEid, setIsEid] = useState(false) const [isFriday, setIsFriday] = useState(false) // Check if current date is Eid or Friday - FIXED LOGIC useEffect(() => { if (!prayerTimes) return // Check if it's Eid al-Fitr (March 30, 2025) setIsEid(prayerTimes.date === "2025-03-30") // Check if today is ACTUALLY Friday - use current date, not prayer times date const today = new Date() const swedenToday = new Date(today.toLocaleString("en-US", { timeZone: "Europe/Stockholm" })) setIsFriday(swedenToday.getDay() === 5) // 5 is Friday in JavaScript's getDay() console.log("Today is Friday:", swedenToday.getDay() === 5, "Day of week:", swedenToday.getDay()) }, [prayerTimes]) // Determine next prayer useEffect(() => { if (!prayerTimes?.prayers) return const updateNextPrayer = () => { const now = new Date() const swedenNow = new Date(now.toLocaleString("en-US", { timeZone: "Europe/Stockholm" })) const currentTime = swedenNow.getHours() * 60 + swedenNow.getMinutes() const next = prayerTimes.prayers.find((prayer) => { const [hours, minutes] = prayer.time.split(":").map(Number) const prayerTime = hours * 60 + minutes return prayerTime > currentTime }) setNextPrayer(next?.name || prayerTimes.prayers[0].name) } updateNextPrayer() const interval = setInterval(updateNextPrayer, 60000) // Check every minute return () => clearInterval(interval) }, [prayerTimes]) if (!prayerTimes || !prayerTimes.prayers) { return (

Loading prayer times...

) } const prayerColors = { Fajr: "bg-blue-600", Sunrise: "bg-cyan-600", Dhuhr: "bg-emerald-600", "Jumu'ah": "bg-emerald-700", // Special color for Jumu'ah Asr: "bg-amber-600", Maghrib: "bg-red-600", Isha: "bg-purple-600", } const prayerIcons = { Fajr: Sunrise, Sunrise: Sun, Dhuhr: SunHigh, "Jumu'ah": SunHigh, // Same icon for Jumu'ah Asr: Sun, Maghrib: Sunset, Isha: Moon, } // Create a modified prayers array with Dhuhr renamed to Jumu'ah ONLY on Fridays const displayPrayers = prayerTimes.prayers.map((prayer) => { // FIXED: Only show Jumu'ah on actual Fridays if (isFriday && prayer.name === "Dhuhr") { return { ...prayer, name: "Jumu'ah", arabicName: "الجمعة", } } return prayer }) return (

{displayPrayers.map((prayer) => { const PrayerIcon = prayerIcons[prayer.name as keyof typeof prayerIcons] || SunHigh const bgColor = prayerColors[prayer.name as keyof typeof prayerColors] || "bg-emerald-600" const isNextPrayer = prayer.name === nextPrayer return (

{prayer.name}

{prayer.arabicName}

{prayer.time}

) })}

) } [V0_FILE]typescriptreact:file="components/eid-greetings.tsx" isMerged="true" "use client" import { useState, useEffect, useRef } from "react" interface EidGreeting { ar: string[] sv: string[] so: string[] sq: string[] // Albanian source?: string } const eidGreetings: EidGreeting[] = [ { ar: ["عيد فطر مبارك", "تقبل الله منا ومنكم صالح الأعمال"], sv: ["Glad Eid al-Fitr", "Må Allah acceptera våra och era goda gärningar"], so: ["Ciid wanaagsan", "Alle ha aqbalo cibaadadeena iyo tiinna"], sq: ["Gëzuar Fitër Bajramin", "Allahu pranoftë veprat tona dhe tuajat të mira"], }, { ar: ["أعاده الله علينا وعليكم باليمن والبركات", "وكل عام وأنتم بخير"], sv: ["Må Allah låta oss uppleva den med välsignelser", "Glad högtid till er alla"], so: ["Alle ha noo soo celsho sanado badan", "Ciid wanaagsan dhammaantiin"], sq: ["Allahu na e ktheftë me begati", "Gëzuar festën të gjithëve"], }, { ar: ["من سنن العيد التكبير والتهليل", "الله أكبر، الله أكبر، لا إله إلا الله"], sv: ["Bland Eid-traditionerna är takbir och tahlil", "Allahu Akbar, Allahu Akbar, La ilaha illa Allah"], so: ["Sunnada Ciidda waxaa ka mid ah takbiirta", "Allahu Akbar, Allahu Akbar, Laa ilaaha illallaah"], sq: ["Nga traditat e Bajramit është tekbiri dhe tehlili", "Allahu Ekber, Allahu Ekber, La ilahe il-lallah"], }, { ar: ["من سنن العيد لبس أحسن الثياب", "والتطيب والاغتسال والتبكير للصلاة"], sv: [ "Bland Eid-traditionerna är att bära sina bästa kläder", "använda parfym, ta ett bad och gå tidigt till bönen", ], so: [ "Sunnada Ciidda waxaa ka mid ah xirashada dharka ugu fiican", "isudayga, qubeyska iyo horay u tegida salaadda", ], sq: ["Nga traditat e Bajramit është veshja e rrobave më të mira", "parfumosja, larja dhe shkuarja herët në namaz"], }, { ar: ["من سنن العيد صلاة العيد", "وهي سنة مؤكدة عن النبي صلى الله عليه وسلم"], sv: ["Bland Eid-traditionerna är Eid-bönen", "vilket är en bekräftad sunna från profeten, frid vare med honom"], so: [ "Sunnada Ciidda waxaa ka mid ah salaadda Ciidda", "taas oo ah sunno xaqiiqeysan oo ka timid Nabiga, nabad iyo naxariis korkiisa ha ahaato", ], sq: [ "Nga traditat e Bajramit është namazi i Bajramit", "e cila është një sunnet i konfirmuar nga Profeti, paqja qoftë mbi të", ], }, ] // Update the component props interface interface EidGreetingsProps { textSpeed?: number languages?: { arabic?: boolean swedish?: boolean somali?: boolean albanian?: boolean } } // Update the component definition export function EidGreetings({ textSpeed = 8, languages = { arabic: true, swedish: true, somali: true, albanian: true }, }: EidGreetingsProps) { const [currentGreetingIndex, setCurrentGreetingIndex] = useState(0) const [currentLanguage, setCurrentLanguage] = useState("ar") const [currentPartIndex, setCurrentPartIndex] = useState(0) // Use refs to maintain interval references const partIntervalRef = useRef(null) const isComponentMounted = useRef(true) // Filter languages based on settings const getEnabledLanguages = (): (keyof EidGreeting)[] => { const enabled: (keyof EidGreeting)[] = [] if (languages.arabic) enabled.push("ar") if (languages.swedish) enabled.push("sv") if (languages.somali) enabled.push("so") if (languages.albanian) enabled.push("sq") return enabled.length > 0 ? enabled : ["ar"] // Fallback to Arabic if nothing selected } // Set up component mount/unmount tracking useEffect(() => { isComponentMounted.current = true return () => { isComponentMounted.current = false } }, []) // Update the content rotation with improved interval management useEffect(() => { // Clear any existing interval if (partIntervalRef.current) { clearInterval(partIntervalRef.current) } const rotateContent = () => { if (!isComponentMounted.current) return if (eidGreetings.length === 0) return const currentGreeting = eidGreetings[currentGreetingIndex % eidGreetings.length] const enabledLanguages = getEnabledLanguages() // If current language is not in enabled languages, reset to first enabled language if (!enabledLanguages.includes(currentLanguage)) { setCurrentLanguage(enabledLanguages[0]) setCurrentPartIndex(0) return } const parts = currentGreeting[currentLanguage] if (currentPartIndex < parts.length - 1) { // Move to next part of the current greeting in the same language setCurrentPartIndex(currentPartIndex + 1) } else { // Current part is the last part, move to next language or greeting const currentLangIndex = enabledLanguages.indexOf(currentLanguage) const nextLangIndex = (currentLangIndex + 1) % enabledLanguages.length if (nextLangIndex <= currentLangIndex) { // We've gone through all languages, move to next greeting const nextGreetingIndex = (currentGreetingIndex + 1) % eidGreetings.length setCurrentGreetingIndex(nextGreetingIndex) } // Move to next language and reset part index setCurrentLanguage(enabledLanguages[nextLangIndex]) setCurrentPartIndex(0) } } // Set up the interval partIntervalRef.current = setInterval(rotateContent, textSpeed * 1000) // Clean up on unmount or when dependencies change return () => { if (partIntervalRef.current) { clearInterval(partIntervalRef.current) } } }, [currentGreetingIndex, currentLanguage, currentPartIndex, textSpeed, languages]) // Handle edge cases if (eidGreetings.length === 0) { return (

Loading Eid greetings...

) } const currentGreeting = eidGreetings[currentGreetingIndex % eidGreetings.length] const enabledLanguages = getEnabledLanguages() // Ensure current language is valid const safeLanguage = enabledLanguages.includes(currentLanguage) ? currentLanguage : enabledLanguages[0] // Ensure current part index is valid const parts = currentGreeting[safeLanguage] const safePartIndex = Math.min(currentPartIndex, parts.length - 1) const text = parts[safePartIndex] return (

{text}

) } [V0_FILE]typescriptreact:file="components/friday-teachings.tsx" isMerged="true" "use client" import { useState, useEffect, useRef } from "react" import { BookOpen } from "lucide-react" interface FridayTeaching { type: string source: string ar: string[] sv: string[] so: string[] sq: string[] } const fridayTeachings: FridayTeaching[] = [ // Quranic verses about Friday { type: "Quran", source: "Surah Al-Jumu'ah 62:9", ar: [ "يَا أَيُّهَا الَّذِينَ آمَنُوا إِذَا نُودِيَ لِلصَّلَاةِ مِن يَوْمِ الْجُمُعَةِ فَاسْعَوْا إِلَىٰ ذِكْرِ اللَّهِ وَذَرُوا الْبَيْعَ", "ذَٰلِكُمْ خَيْرٌ لَّكُمْ إِن كُنتُمْ تَعْلَمُونَ", ], sv: [ "O ni som tror! När kallelsen till bön ljuder på fredagen, skynda er då till åminnelsen av Gud och lämna all handel.", "Detta är bättre för er, om ni bara visste.", ], so: [ "Kuwa xaqa rumeeyay! Marka loogu yeero salaadda maalinta Jimcaha, u ordo xusidda Alle oo ganacsi ka taga.", "Taasi waa khayr idiin ah haddaad taqaan.", ], sq: [ "O ju që besoni! Kur të thirret për namaz ditën e xhuma, nxitoni për të përmendur Allahun dhe lini tregtinë.", "Kjo është më e mirë për ju, nëse e dini.", ], }, { type: "Quran", source: "Surah Al-Jumu'ah 62:10", ar: ["فَإِذَا قُضِيَتِ الصَّلَاةُ فَانتَشِرُوا فِي الْأَرْضِ وَابْتَغُوا مِن فَضْلِ اللَّهِ", "وَاذْكُرُوا اللَّهَ كَثِيرًا لَّعَلَّكُمْ تُفْلِحُونَ"], sv: [ "Och när bönen är slut, sprid er då över jorden och sök Guds gåvor.", "Och åkalla Gud ofta, så att det går er väl.", ], so: [ "Markii la dhammeeyo salaadda, ku faafa dhulka oo ka doona fadliga Ilaahay.", "Xusuusta Ilaahay si aad u guulaysataan.", ], sq: [ "E kur të kryhet namazi, shpërndahuni nëpër tokë dhe kërkoni nga të mirat e Allahut.", "Dhe përmendni Allahun shumë, që të shpëtoni.", ], }, { type: "Hadith", source: "Sahih Muslim", ar: ["خَيْرُ يَوْمٍ طَلَعَتْ عَلَيْهِ الشَّمْسُ يَوْمُ الْجُمُعَةِ", "فِيهِ خُلِقَ آدَمُ وَفِيهِ أُدْخِلَ الْجَنَّةَ وَفِيهِ أُخْرِجَ مِنْهَا"], sv: [ "Den bästa dagen som solen har gått upp över är fredagen.", "På den dagen skapades Adam, på den dagen fördes han in i paradiset och på den dagen fördes han ut därifrån.", ], so: [ "Maalinta ugu khayrka badan ee qorraxdu ku soo baxday waa maalinta Jimcaha.", "Maalintaas waxaa la abuuray Aadam, waxaa lagu geliyay Jannada, waxaana laga saaray.", ], sq: [ "Dita më e mirë në të cilën ka lindur dielli është dita e xhuma.", "Në të u krijua Ademi, në të u fut në xhenet dhe në të u nxor prej tij.", ], }, { type: "Hadith", source: "Sahih al-Bukhari", ar: ["مَنِ اغْتَسَلَ يَوْمَ الْجُمُعَةِ غُسْلَ الْجَنَابَةِ ثُمَّ رَاحَ فَكَأَنَّمَا قَرَّبَ بَدَنَةً", "وَمَنْ رَاحَ فِي السَّاعَةِ الثَّانِيَةِ فَكَأَنَّمَا قَرَّبَ بَقَرَةً"], sv: [ "Den som tvättar sig på fredagen som en stor tvagning och sedan går tidigt, det är som om han offrade en kamel.", "Och den som går i den andra timmen, det är som om han offrade en ko.", ], so: [ "Qofkii maydha maalinta Jimcaha oo u baxo goor hore, waxaa la mooda inuu bixiyay geel.", "Qofkii u baxa saacadda labaad, waxaa la mooda inuu bixiyay lo'.", ], sq: [ "Kush lahet ditën e xhuma si pastrimi i madh dhe shkon herët, është sikur të ketë ofruar deve.", "Dhe kush shkon në orën e dytë, është sikur të ketë ofruar lopë.", ], }, { type: "Hadith", source: "Sahih Muslim", ar: ["إِنَّ فِي الْجُمُعَةِ لَسَاعَةً لَا يُوَافِقُهَا مُسْلِمٌ يَسْأَلُ اللَّهَ فِيهَا خَيْرًا إِلَّا أَعْطَاهُ إِيَّاهُ"], sv: ["Det finns en stund på fredagen då ingen muslim ber till Gud om något gott utan att Han ger honom det."], so: ["Maalinta Jimcaha waxaa ku jira saacad aan Muslim u soo jeedo Ilaahay wax wanaagsan isagoon la siinin."], sq: ["Ka një orë të premten që nëse muslimani i lutet Allahut për diçka të mirë, Ai do t'ia japë atë."], }, { type: "Hadith", source: "Sunan Ibn Majah", ar: ["أَكْثِرُوا الصَّلَاةَ عَلَيَّ يَوْمَ الْجُمُعَةِ وَلَيْلَةَ الْجُمُعَةِ", "فَمَنْ صَلَّى عَلَيَّ صَلَاةً صَلَّى اللَّهُ عَلَيْهِ عَشْرًا"], sv: [ "Öka era böner för mig på fredagen och fredagsnatten.", "Den som sänder en välsignelse över mig, Allah sänder tio välsignelser över honom.", ], so: [ "Badiya salaadda aniga ii dirto maalinta Jimcaha iyo habeenka Jimcaha.", "Qofkii ii soo diro salaan, Ilaahay ayaa toban salaan u soo diraya.", ], sq: [ "Shtoni salavatet mbi mua ditën e xhuma dhe natën e xhuma.", "Kush më dërgon një salavat, Allahu i dërgon atij dhjetë bekime.", ], }, { type: "Hadith", source: "Sahih al-Bukhari", ar: ["الْجُمُعَةُ إِلَى الْجُمُعَةِ كَفَّارَةٌ لِمَا بَيْنَهُمَا مَا لَمْ تُغْشَ الْكَبَائِرُ"], sv: [ "Fredagsbönen till nästa fredagsbön är en försoning för synderna däremellan, så länge man undviker de stora synderna.", ], so: ["Jimcaha ilaa Jimcaha waa kafaaro dembiyada u dhaxeeya, hadday ka fogaadaan dambiyada waaweyn."], sq: [ "Namazi i xhumasë deri në xhumanë tjetër është shlyerje për mëkatet mes tyre, nëse shmanget mëkateve të mëdha.", ], }, { type: "Quran", source: "Surah Al-Kahf 18:28", ar: ["وَاصْبِرْ نَفْسَكَ مَعَ الَّذِينَ يَدْعُونَ رَبَّهُم بِالْغَدَاةِ وَالْعَشِيِّ يُرِيدُونَ وَجْهَهُ"], sv: ["Och var tålmodig med dem som åkallar sin Herre morgon och kväll och söker Hans ansikte."], so: ["Ku samir nafta kuwa barya Rabbigood aroortii iyo galabta iyagoo raba wejiga Ilaahay."], sq: ["Dhe ji i durueshëm me ata që i luten Zotit të tyre mëngjes e mbrëmje, duke kërkuar kënaqësinë e Tij."], }, { type: "Hadith", source: "Sahih Muslim", ar: ["مَنْ قَرَأَ سُورَةَ الْكَهْفِ يَوْمَ الْجُمُعَةِ أَضَاءَ لَهُ مِنَ النُّورِ مَا بَيْنَ الْجُمُعَتَيْنِ"], sv: [ "Den som läser Surah Al-Kahf på fredagen, kommer att ha ett ljus som lyser för honom mellan de två fredagarna.", ], so: ["Qofkii akhriyo Suuratu Al-Kahf maalinta Jimcaha, waxaa u iftiimi doona nuur labada Jimcood dhaxdooda."], sq: ["Kush lexon Suren el-Kehf ditën e xhuma, do të ketë dritë që e ndriçon mes dy xhumave."], }, { type: "Hadith", source: "Sahih al-Bukhari", ar: ["مَنْ تَوَضَّأَ فَأَحْسَنَ الْوُضُوءَ ثُمَّ أَتَى الْجُمُعَةَ فَاسْتَمَعَ وَأَنْصَتَ غُفِرَ لَهُ مَا بَيْنَهُ وَبَيْنَ الْجُمُعَةِ وَزِيَادَةُ ثَلَاثَةِ أَيَّامٍ"], sv: [ "Den som gör wudu ordentligt och sedan går till fredagsbönen, lyssnar och är tyst, får förlåtelse för sina synder mellan de två fredagarna och tre dagar till.", ], so: [ "Qofkii si fiican u sameeyo weysada oo u yimaado Jimcaha oo dhagaysto oo aamusan, waxaa loo cafiyaa dembiyada u dhaxeeya labada Jimcood iyo saddex maalmood dheeraad ah.", ], sq: [ "Kush merr abdes mirë dhe pastaj shkon në xhuma, dëgjon dhe hesht, i falen mëkatet mes dy xhumave dhe tre ditë të tjera.", ], }, { type: "Hadith", source: "Sunan Abu Dawud", ar: [ "مَنْ غَسَّلَ يَوْمَ الْجُمُعَةِ وَاغْتَسَلَ وَبَكَّرَ وَابْتَكَرَ وَمَشَى وَلَمْ يَرْكَبْ وَدَنَا مِنَ الْإِمَامِ فَاسْتَمَعَ وَلَمْ يَلْغُ كَانَ لَهُ بِكُلِّ خُطْوَةٍ عَمَلُ سَنَةٍ أَجْرُ صِيَامِهَا وَقِيَامِهَا", ], sv: [ "Den som badar, går tidigt till fredagsbönen, går till fots, sitter nära imamen, lyssnar och inte pratar förgäves, får belöningen av ett års fasta och nattbön för varje steg.", ], so: [ "Qofkii maydho maalinta Jimcaha oo goor hore u baxo oo lugaynayo oo u dhawaaday imaanka oo dhagaysto oo aan hadlin wax aan qiimo lahayn, waxaa loo qoraa tallaabo kasta ajriga soonida iyo qiyaamida sannad.", ], sq: [ "Kush lahet ditën e xhuma, shkon herët, shkon në këmbë, ulet pranë imamit, dëgjon dhe nuk flet kotë, ka shpërblimin e një viti agjërimi dhe namazi të natës për çdo hap.", ], }, { type: "Hadith", source: "Jami' at-Tirmidhi", ar: ["إِنَّ يَوْمَ الْجُمُعَةِ سَيِّدُ الْأَيَّامِ وَأَعْظَمُهَا عِنْدَ اللَّهِ وَهُوَ أَعْظَمُ عِنْدَ اللَّهِ مِنْ يَوْمِ الْأَضْحَى وَيَوْمِ الْفِطْرِ"], sv: [ "Fredagen är herren över alla dagar och den mest ärade hos Allah, och den är mer ärad hos Allah än Eid al-Adha och Eid al-Fitr.", ], so: [ "Jimcaha waa sayidka maalmaha oo ugu weyn xagga Ilaahay, waxaana ugu weyn xagga Ilaahay maalinta Ciidda Adhaha iyo Ciidda Fitriga.", ], sq: [ "Dita e xhuma është zotëria e ditëve dhe më e madhja tek Allahu, dhe është më e madhja tek Allahu se sa dita e Kurban Bajramit dhe Ramazan Bajramit.", ], }, { type: "Quran", source: "Surah Al-Kahf 18:1", ar: ["الْحَمْدُ لِلَّهِ الَّذِي أَنزَلَ عَلَىٰ عَبْدِهِ الْكِتَابَ وَلَمْ يَجْعَل لَّهُ عِوَجًا"], sv: ["Prisat vare Gud som har uppenbarat Boken för Sin tjänare och inte satt någon krokighet i den."], so: ["Mahad waxaa leh Ilaahay kii u soo dejiyay Kitaabka addoonkiisa uuna ka dhigin qalloocan."], sq: ["Falënderimet i takojnë Allahut që ia zbriti Librin robit të Tij dhe nuk vendosi në të asnjë shtrembërim."], }, { type: "Hadith", source: "Sahih Muslim", ar: ["إِذَا كَانَ يَوْمُ الْجُمُعَةِ كَانَ عَلَى كُلِّ بَابٍ مِنْ أَبْوَابِ الْمَسْجِدِ مَلَائِكَةٌ يَكْتُبُونَ الْأَوَّلَ فَالْأَوَّلَ"], sv: [ "På fredagen står änglar vid varje dörr till moskén och skriver ner de första som kommer, den ene efter den andre.", ], so: ["Maalinta Jimcaha waxaa albaabka kasta oo masaajidka taagan malaa'igo qoraysa kuwa hore iyo kuwa dambe."], sq: ["Ditën e xhuma, tek çdo derë e xhamisë qëndrojnë engjëj që shënojnë të parët që vijnë, njëri pas tjetrit."], }, { type: "Hadith", source: "Sahih al-Bukhari", ar: ["مَنْ تَرَكَ ثَلَاثَ جُمَعٍ تَهَاوُنًا طَبَعَ اللَّهُ عَلَى قَلْبِهِ"], sv: ["Den som lämnar tre fredagsbön av försumlighet, Allah förseglar hans hjärta."], so: ["Qofkii ka tago saddex Jimcood iyagoo ku sameeyay dayac, Ilaahay ayaa xatimaya qalbigiisa."], sq: ["Kush lë tre xhuma nga pakujdesia, Allahu ia vulosos zemrën."], }, { type: "Quran", source: "Surah Al-Kahf 18:10", ar: ["إِذْ أَوَى الْفِتْيَةُ إِلَى الْكَهْفِ فَقَالُوا رَبَّنَا آتِنَا مِن لَّدُنكَ رَحْمَةً وَهَيِّئْ لَنَا مِنْ أَمْرِنَا رَشَدًا"], sv: [ "När de unga männen sökte sin tillflykt i grottan sade de: Vår Herre! Giv oss Din barmhärtighet och ordna våra angelägenheter rätt för oss.", ], so: [ "Markay raggiisii dhallinyarada ahaa u magangaleen godka, waxay yidhaahdeen: Rabbigayagow na sii naxariis adigaa leh oo xaalkeenna noogu hagaaji.", ], sq: [ "Kur të rinjtë u strehuan në shpellë, thanë: O Zoti ynë! Na jep mëshirë nga Ti dhe na përgatit rrugë të drejtë për çështjen tonë.", ], }, { type: "Hadith", source: "Sunan Ibn Majah", ar: ["مَنْ قَرَأَ سُورَةَ الْكَهْفِ فِي يَوْمِ الْجُمُعَةِ أَضَاءَ لَهُ النُّورُ مَا بَيْنَهُ وَبَيْنَ الْبَيْتِ الْعَتِيقِ"], sv: ["Den som läser Surah Al-Kahf på fredagen, kommer ljus att lysa för honom mellan honom och Kaaba."], so: [ "Qofkii akhriyo Suuratu Al-Kahf maalinta Jimcaha, waxaa u iftiimi doona nuur u dhexeeya isaga iyo Baytiga Caatiqa (Ka'bah).", ], sq: ["Kush lexon Suren el-Kehf ditën e xhuma, do të ketë dritë që ndriçon mes tij dhe Qabesë."], }, { type: "Hadith", source: "Sahih Muslim", ar: ["مَنْ صَلَّى الصُّبْحَ فِي جَمَاعَةٍ ثُمَّ قَعَدَ يَذْكُرُ اللَّهَ حَتَّى تَطْلُعَ الشَّمْسُ ثُمَّ صَلَّى رَكْعَتَيْنِ كَانَتْ لَهُ كَأَجْرِ حَجَّةٍ وَعُمْرَةٍ تَامَّةٍ تَامَّةٍ تَامَّةٍ"], sv: [ "Den som ber gryningsbönen i gemenskap och sedan sitter och åkallar Gud tills solen går upp och sedan ber två rakat, får belöningen av en fullständig Hajj och Umrah.", ], so: [ "Qofkii tukaday Subax jama'o ah kadibna fadhiisto isagoo xusuusanayo Ilaahay ilaa qorraxdu soo baxdo kadibna tukaado laba raka'ad, wuxuu heli doonaa ajriga Xaj iyo Cumrah dhammaystiran.", ], sq: [ "Kush fal namazin e sabahut në xhemat dhe pastaj ulet duke përmendur Allahun derisa të lindë dielli dhe pastaj fal dy rekate, ka shpërblimin e një haxhi dhe umre të plotë.", ], }, { type: "Quran", source: "Surah Al-Jumu'ah 62:11", ar: [ "وَإِذَا رَأَوْا تِجَارَةً أَوْ لَهْوًا انفَضُّوا إِلَيْهَا وَتَرَكُوكَ قَائِمًا ۚ قُلْ مَا عِندَ اللَّهِ خَيْرٌ مِّنَ اللَّهْوِ وَمِنَ التِّجَارَةِ ۚ وَاللَّهُ خَيْرُ الرَّازِقِينَ", ], sv: [ "När de ser handel eller underhållning, skyndar de sig dit och lämnar dig stående. Säg: Det som är hos Gud är bättre än underhållning och handel. Gud är den bästa försörjaren.", ], so: [ "Markay arkaan ganacsi ama madadaalo, way u firidhiyaan oo adiga way kaa tagaan adoo taagan. Dheh: Waxaa Ilaahay ku jira ayaa ka wanaagsan madadaalada iyo ganacsiga. Ilaahay waa Razzaaqka ugu fiican.", ], sq: [ "Kur shohin tregti ose argëtim, shpërndahen drejt saj dhe të lënë ty në këmbë. Thuaj: Ajo që është tek Allahu është më e mirë se argëtimi dhe tregtia. Allahu është Furnizuesi më i mirë.", ], }, { type: "Hadith", source: "Sahih al-Bukhari", ar: ["مَنْ حَافَظَ عَلَى الصَّلَوَاتِ الْخَمْسِ رَكُوعِهِنَّ وَسُجُودِهِنَّ وَوُضُوئِهِنَّ وَمَوَاقِيتِهِنَّ كَانَتْ لَهُ عَهْدٌ عِنْدَ اللَّهِ أَنْ يُدْخِلَهُ الْجَنَّةَ"], sv: [ "Den som håller de fem dagliga bönerna med deras böjningar, nedkasten, wudu och tider, har ett löfte från Allah att Han kommer att föra honom in i paradiset.", ], so: [ "Qofkii ilaaliyo shanta salood rukuucooda, sujuudooda, weysadooda iyo waqtiyadooda, wuxuu leeyahay ballan Ilaahay ah inuu gelin doono Jannada.", ], sq: [ "Kush i ruan pesë namazet me rukutë, sexhdet, abdesin dhe kohët e tyre, ka një premtim nga Allahu që do ta fusë në xhenet.", ], }, ] // Update the component props interface interface FridayTeachingsProps { textSpeed?: number languages?: { arabic?: boolean swedish?: boolean somali?: boolean albanian?: boolean } } // FIXED: Only show on actual Fridays export function FridayTeachings({ textSpeed = 8, languages = { arabic: true, swedish: true, somali: true, albanian: true }, }: FridayTeachingsProps) { const [currentTeachingIndex, setCurrentTeachingIndex] = useState(0) const [currentPartIndex, setCurrentPartIndex] = useState(0) const [currentLanguage, setCurrentLanguage] = useState>("ar") const [isFriday, setIsFriday] = useState(false) const [isAnimating, setIsAnimating] = useState(false) const [showKahfReminder, setShowKahfReminder] = useState(true) const partIntervalRef = useRef(null) const isComponentMounted = useRef(true) // Check if it's actually Friday - FIXED useEffect(() => { const checkIfFriday = () => { const today = new Date() const swedenToday = new Date(today.toLocaleString("en-US", { timeZone: "Europe/Stockholm" })) setIsFriday(swedenToday.getDay() === 5) } checkIfFriday() // Check every minute in case day changes const interval = setInterval(checkIfFriday, 60000) return () => { clearInterval(interval) isComponentMounted.current = false } }, []) // Filter languages based on settings const getEnabledLanguages = (): (keyof Omit)[] => { const enabled: (keyof Omit)[] = [] if (languages.arabic) enabled.push("ar") if (languages.swedish) enabled.push("sv") if (languages.somali) enabled.push("so") if (languages.albanian) enabled.push("sq") return enabled.length > 0 ? enabled : ["ar"] // Fallback to Arabic if nothing selected } // Update the content rotation with improved interval management useEffect(() => { // Only run if it's Friday if (!isFriday) { if (partIntervalRef.current) { clearInterval(partIntervalRef.current) } return } // Clear any existing interval if (partIntervalRef.current) { clearInterval(partIntervalRef.current) } const rotateContent = () => { if (!isComponentMounted.current || !isFriday) return if (fridayTeachings.length === 0) return setIsAnimating(true) setTimeout(() => { const currentTeaching = fridayTeachings[currentTeachingIndex % fridayTeachings.length] const enabledLanguages = getEnabledLanguages() // If current language is not in enabled languages, reset to first enabled language if (!enabledLanguages.includes(currentLanguage)) { setCurrentLanguage(enabledLanguages[0]) setCurrentPartIndex(0) setIsAnimating(false) return } const parts = currentTeaching[currentLanguage] if (currentPartIndex < parts.length - 1) { // Move to next part of the current teaching in the same language setCurrentPartIndex(currentPartIndex + 1) } else { // Current part is the last part, move to next language or teaching const currentLangIndex = enabledLanguages.indexOf(currentLanguage) const nextLangIndex = (currentLangIndex + 1) % enabledLanguages.length if (nextLangIndex <= currentLangIndex) { // We've gone through all languages, move to next teaching const nextTeachingIndex = (currentTeachingIndex + 1) % fridayTeachings.length setCurrentTeachingIndex(nextTeachingIndex) } // Move to next language and reset part index setCurrentLanguage(enabledLanguages[nextLangIndex]) setCurrentPartIndex(0) } setIsAnimating(false) }, 300) // Wait for exit animation } // Set up the interval partIntervalRef.current = setInterval(rotateContent, textSpeed * 1000) // Clean up on unmount or when dependencies change return () => { if (partIntervalRef.current) { clearInterval(partIntervalRef.current) } } }, [currentTeachingIndex, currentLanguage, currentPartIndex, textSpeed, languages, isFriday]) // Don't render if it's not Friday if (!isFriday) { return null } // Handle edge cases if (fridayTeachings.length === 0) { return (

Loading Friday teachings...

) } const currentTeaching = fridayTeachings[currentTeachingIndex % fridayTeachings.length] const enabledLanguages = getEnabledLanguages() // Ensure current language is valid const safeLanguage = enabledLanguages.includes(currentLanguage) ? currentLanguage : enabledLanguages[0] // Ensure current part index is valid const parts = currentTeaching[safeLanguage] const safePartIndex = Math.min(currentPartIndex, parts.length - 1) const text = parts[safePartIndex] return (

{showKahfReminder && (

📖 اقرأ سورة الكهف | Läs Surah Al-Kahf idag | Read Surah Al-Kahf today

)}

{currentTeaching.type} - {currentTeaching.source}

{text}

) } [V0_FILE]typescriptreact:file="components/iqama-icon.tsx" isMerged="true" "use client" import { useState, useEffect } from "react" import type { DailyPrayers } from "@/types/prayer" interface IqamaIconProps { prayerTimes: DailyPrayers | null } export function IqamaIcon({ prayerTimes }: IqamaIconProps) { const [showIqama, setShowIqama] = useState(false) const [iqamaText, setIqamaText] = useState("") const [currentInfoIndex, setCurrentInfoIndex] = useState(0) const mosqueInfo = [ "Besöksadress: Västergatan 15 B 33232 Gislaved", "Mob: 0737719347 / 0765905090", "Bankuppgifter:", "Swedbank: 84178 947377073", "Bankgiro: 755-3803", "Swish: 123 196 03 50", ] useEffect(() => { if (!prayerTimes) return const checkIqamaTime = () => { const now = new Date() const currentTime = now.getHours() * 60 + now.getMinutes() const iqamaTimes = { Fajr: 10, Dhuhr: 10, Asr: 7, Maghrib: 5, Isha: 7, } for (const prayer of prayerTimes.prayers) { if (prayer.name === "Sunrise") continue const [hours, minutes] = prayer.time.split(":").map(Number) const prayerTime = hours * 60 + minutes const iqamaTime = prayerTime + iqamaTimes[prayer.name as keyof typeof iqamaTimes] if (currentTime >= prayerTime && currentTime < iqamaTime + 5) { setShowIqama(true) setIqamaText(prayer.arabicName) return } } setShowIqama(false) setIqamaText("") } checkIqamaTime() const interval = setInterval(checkIqamaTime, 60000) // Check every minute // Slow down the mosque info animation const infoInterval = setInterval(() => { setCurrentInfoIndex((prevIndex) => (prevIndex + 1) % mosqueInfo.length) }, 20000) // Change info every 20 seconds return () => { clearInterval(interval) clearInterval(infoInterval) } }, [prayerTimes]) if (!prayerTimes) { return (

) } if (showIqama) { return (

IQAMA

{iqamaText}

) } return (

GISLAVED MOSKE

{mosqueInfo[currentInfoIndex]}

) } [V0_FILE]typescriptreact:file="components/islamic-teachings.tsx" isMerged="true" "use client" import { useState, useEffect, useRef } from "react" interface TeachingContent { ar: string[] sv: string[] so: string[] sq: string[] // Albanian source?: string topic: "charity" | "prayer" | "prayer-rulings" } // Update the component props interface interface IslamicTeachingsProps { textSpeed?: number languages?: { arabic?: boolean swedish?: boolean somali?: boolean albanian?: boolean } } const islamicTeachings: TeachingContent[] = [ // Charity (Sadaqah) teachings { topic: "charity", ar: ["الصدقة تطفئ الخطيئة كما يطفئ الماء النار", "رواه الترمذي"], sv: ["Allmosan släcker synden precis som vatten släcker eld", "Berättat av Tirmidhi"], so: ["Sadaqadu waxay demisaa dembiga sida biyuhu u demiyaan dabka", "Waxaa weriyay Tirmidhi"], sq: ["Sadakaja e shuajt mëkatin ashtu siç uji e shuajt zjarrin", "Transmetuar nga Tirmidhi"], source: "Tirmidhi", }, { topic: "charity", ar: ["ما نقص مال من صدقة", "رواه الترمذي"], sv: ["Rikedom minskar aldrig på grund av välgörenhet", "Berättat av Tirmidhi"], so: ["Maal kama yaraado sadaqo", "Waxaa weriyay Tirmidhi"], sq: ["Pasuria nuk pakësohet nga sadakaja", "Transmetuar nga Tirmidhi"], source: "Tirmidhi", }, { topic: "charity", ar: ["وَمَا تُنفِقُوا مِنْ خَيْرٍ فَلِأَنفُسِكُمْ", "سورة البقرة: 272"], sv: ["Och vad ni än ger ut av gott, så är det för er själva", "Koranen 2:272"], so: ["Wixii khayr ah oo aad bixisaan waa naftiinna", "Qur'aanka 2:272"], sq: ["Dhe çfarëdo që shpenzoni nga e mira, është për veten tuaj", "Kurani 2:272"], source: "Quran 2:272", }, { topic: "charity", ar: ["الساعي على الأرملة والمسكين كالمجاهد في سبيل الله", "رواه البخاري ومسلم"], sv: ["Den som hjälper änkor och behövande är som en som kämpar för Allahs sak", "Berättat av Bukhari och Muslim"], so: [ "Qofka u shaqeeya carmalka iyo miskiinka wuxuu la mid yahay qofka ku dagaalamaya jidka Alle", "Waxaa weriyay Bukhari iyo Muslim", ], sq: [ "Ai që kujdeset për të vejën dhe nevojtarin është si luftëtari në rrugën e Allahut", "Transmetuar nga Bukhari dhe Muslimi", ], source: "Bukhari & Muslim", }, { topic: "charity", ar: ["اتقوا النار ولو بشق تمرة", "رواه البخاري ومسلم"], sv: ["Skydda er från elden, även om det är med halva en dadel", "Berättat av Bukhari och Muslim"], so: ["Ka dhawrsada naarta xitaa haddii ay tahay badhki timir", "Waxaa weriyay Bukhari iyo Muslim"], sq: ["Ruajuni veten nga zjarri, qoftë edhe me gjysmë hurme", "Transmetuar nga Bukhari dhe Muslimi"], source: "Bukhari & Muslim", }, { topic: "charity", ar: ["إِنَّمَا الصَّدَقَاتُ لِلْفُقَرَاءِ وَالْمَسَاكِينِ", "سورة التوبة: 60"], sv: ["Allmosorna är endast för de fattiga och behövande", "Koranen 9:60"], so: ["Sadaqooyinka waxaa iska leh saboolka iyo masaakiinta", "Qur'aanka 9:60"], sq: ["Sadakatë janë vetëm për të varfrit dhe nevojtarët", "Kurani 9:60"], source: "Quran 9:60", }, // Prayer (Salah) teachings { topic: "prayer", ar: ["أَقِمِ الصَّلَاةَ إِنَّ الصَّلَاةَ تَنْهَىٰ عَنِ الْفَحْشَاءِ وَالْمُنكَرِ", "سورة العنكبوت: 45"], sv: ["Förrätta bönen. Bönen avhåller från skamlöshet och det förkastliga", "Koranen 29:45"], so: ["Oog salaadda. Salaaddu waxay ka reebta xumaan iyo waxa la nacay", "Qur'aanka 29:45"], sq: ["Fale namazin. Namazi të ndalon nga shthurja dhe e keqja", "Kurani 29:45"], source: "Quran 29:45", }, { topic: "prayer", ar: ["حافظوا على الصلوات والصلاة الوسطى وقوموا لله قانتين", "سورة البقرة: 238"], sv: ["Bevaka noga era böner, särskilt den mellersta bönen, och stå i ödmjuk lydnad inför Allah", "Koranen 2:238"], so: ["Ilaaliya salaadaha, gaar ahaan salaadda dhexe, oo u istaaga Alle addeec", "Qur'aanka 2:238"], sq: ["Ruani namazet, veçanërisht namazin e mesëm, dhe qëndroni në bindje ndaj Allahut", "Kurani 2:238"], source: "Quran 2:238", }, { topic: "prayer", ar: ["من ترك الصلاة متعمدا فقد كفر", "رواه الترمذي"], sv: ["Den som avsiktligt överger bönen har begått otro", "Berättat av Tirmidhi"], so: ["Qofka oo ula kac u daaya salaadda wuu gaaloobay", "Waxaa weriyay Tirmidhi"], sq: ["Kush e lë namazin me qëllim, ka bërë kufër", "Transmetuar nga Tirmidhi"], source: "Tirmidhi", }, { topic: "prayer", ar: ["من مبطلات الصلاة: الكلام العمد، والضحك، والأكل والشرب", "من فقه الصلاة"], sv: ["Bland det som upphäver bönen: avsiktligt tal, skratt, äta och dricka", "Från bönejuridik"], so: ["Waxyaabaha buriya salaadda: hadalka ula kaca ah, qosol, cunto iyo cabid", "Fiqhiga salaadda"], sq: [ "Nga gjërat që e prishin namazin: të folurit me qëllim, të qeshurit, të ngrënit dhe të pirit", "Nga fikhu i namazit", ], source: "Fiqh of Prayer", }, { topic: "prayer", ar: ["الصلاة عماد الدين، من أقامها فقد أقام الدين", "حديث"], sv: ["Bönen är religionens pelare. Den som upprätthåller den har upprätthållit religionen", "Hadith"], so: ["Salaaddu waa tiirka diinta. Qofkii ooga salaadda wuxuu oogay diinta", "Xadiis"], sq: ["Namazi është shtylla e fesë. Kush e ngre atë, ka ngritur fenë", "Hadith"], source: "Hadith", }, { topic: "prayer", ar: ["من شروط صحة الصلاة: الطهارة، واستقبال القبلة، وستر العورة", "من فقه الصلاة"], sv: ["Bland villkoren för en giltig bön: renhet, att vända sig mot qibla, och att täcka awrah", "Från bönejuridik"], so: ["Shuruudaha saxnimada salaadda: daahirnimo, in la jeesto qiblada, iyo asturida cawrada", "Fiqhiga salaadda"], sq: [ "Nga kushtet e vlefshmërisë së namazit: pastërtia, drejtimi kah kibla, dhe mbulimi i avretit", "Nga fikhu i namazit", ], source: "Fiqh of Prayer", }, // New content about Prayer Rulings (أحكام الصلاة) { topic: "prayer-rulings", ar: ["الصلاة فرض على كل مسلم بالغ عاقل", "وهي أول ما يحاسب عليه العبد يوم القيامة"], sv: [ "Bönen är obligatorisk för varje vuxen, förnuftig muslim", "Det är det första som en person kommer att ställas till svars för på Domedagen", ], so: [ "Salaaddu waa waajib kasta oo muslim ah oo caqli leh", "Waa wixii ugu horreeya ee qofka lagu xisaabtami doono Maalinta Qiyaamaha", ], sq: [ "Namazi është i detyrueshëm për çdo musliman të rritur, të mençur", "Është gjëja e parë për të cilën njeriu do të merret në llogari në Ditën e Gjykimit", ], source: "Fiqh of Prayer", }, { topic: "prayer-rulings", ar: ["من شروط صحة الصلاة: دخول الوقت، والنية، واستقبال القبلة", "والطهارة من الحدث والنجس، وستر العورة"], sv: [ "Bland villkoren för en giltig bön: att tiden har inträtt, intention, att vända sig mot qibla", "renhet från rituell orenhet och orenhet, och att täcka awrah", ], so: [ "Shuruudaha saxnimada salaadda: galitaanka waqtiga, niyada, u jeesashada qiblada", "daahirnimada ka hadaska iyo najaska, iyo asturida cawrada", ], sq: [ "Nga kushtet e vlefshmërisë së namazit: hyrja e kohës, nijeti, drejtimi kah kibla", "pastërtia nga hadethi dhe papastërtia, dhe mbulimi i avretit", ], source: "Fiqh of Prayer", }, { topic: "prayer-rulings", ar: [ "أركان الصلاة: القيام مع القدرة، وتكبيرة الإحرام، وقراءة الفاتحة", "والركوع، والرفع منه، والسجود، والجلوس بين السجدتين", ], sv: [ "Bönens pelare: att stå om man kan, inledande takbir, att läsa Fatiha", "att böja sig, att resa sig från böjningen, att prostrera sig, att sitta mellan prostrationerna", ], so: [ "Tiirarka salaadda: istaagga marka aad awooddo, takbiiratul-ixraam, akhrisashada Faatixa", "rukuuca, ka soo kicitaanka, sujuudda, fadhiga u dhexeeya labada sujuud", ], sq: [ "Shtyllat e namazit: qëndrimi në këmbë kur është e mundur, tekbiri fillestar, leximi i Fatihasë", "përkulja, ngritja nga përkulja, sexhdja, ulja mes dy sexhdeve", ], source: "Fiqh of Prayer", }, { topic: "prayer-rulings", ar: [ "واجبات الصلاة: التكبيرات غير تكبيرة الإحرام، وقول سبحان ربي العظيم في الركوع", "وقول سمع الله لمن حمده، وقول ربنا ولك الحمد، وقول سبحان ربي الأعلى في السجود", ], sv: [ "Bönens obligatoriska handlingar: alla takbir utom den inledande, att säga 'Subhana Rabbiyal Adhim' i böjningen", "att säga 'Sami Allahu liman hamidah', att säga 'Rabbana wa lakal hamd', att säga 'Subhana Rabbiyal A'la' i prostrationen", ], so: [ "Waajibaadka salaadda: takbiirka aan ahayn takbiiratul-ixraam, iyo oraahda 'Subxaana Rabbiyal Cadhiim' inta rukuuca lagu jiro", "iyo oraahda 'Sami Allaahu liman xamidah', iyo oraahda 'Rabbanaa wa lakal xamd', iyo oraahda 'Subxaana Rabbiyal Aclaa' inta sujuudda lagu jiro", ], sq: [ "Veprimet e detyrueshme të namazit: të gjitha tekbiret përveç tekbirit fillestar, të thuash 'Subhane Rabbijel Adhim' në përkulje", "të thuash 'Semi Allahu limen hamideh', të thuash 'Rabbena ve lekel hamd', të thuash 'Subhane Rabbijel A'la' në sexhde", ], source: "Fiqh of Prayer", }, { topic: "prayer-rulings", ar: [ "من مبطلات الصلاة: الكلام العمد، والحركة الكثيرة المتوالية", "والحدث، وانكشاف العورة، واستدبار القبلة، والأكل والشرب", ], sv: [ "Bland det som upphäver bönen: avsiktligt tal, många på varandra följande rörelser", "rituell orenhet, att awrah blir synlig, att vända ryggen mot qibla, att äta och dricka", ], so: [ "Waxyaabaha buriya salaadda: hadalka ula kaca ah, dhaqdhaqaaqa badan ee is xiga", "hadaska, soo bannaanka soo bixida cawrada, dhabarka u jeedsiga qiblada, cunista iyo cabista", ], sq: [ "Nga gjërat që e prishin namazin: të folurit me qëllim, lëvizjet e shumta të njëpasnjëshme", "hadethi, zbulimi i avretit, kthimi i shpinës nga kibla, ngrënia dhe pirja", ], source: "Fiqh of Prayer", }, { topic: "prayer-rulings", ar: [ "سنن الصلاة: رفع اليدين عند التكبير، ووضع اليمنى على اليسرى", "وقراءة دعاء الاستفتاح، والتعوذ، والبسملة، وقول آمين، وقراءة سورة بعد الفاتحة", ], sv: [ "Bönens sunna-handlingar: att lyfta händerna vid takbir, att placera höger hand över vänster", "att läsa öppningsduaa, att söka skydd hos Allah, att säga bismillah, att säga amin, att läsa en sura efter Fatiha", ], so: [ "Sunnada salaadda: gacmaha kor u qaadista marka la leeyahay takbiir, iyo gacanta midig saarista tan bidix", "iyo akhrisashada ducada furitaanka, iyo magangalynta Alle, iyo bismillaah, iyo oraahda aamiin, iyo akhrisashada suurad ka dib Faatixa", ], sq: [ "Veprimet sunnet të namazit: ngritja e duarve gjatë tekbirit, vendosja e dorës së djathtë mbi të majtën", "leximi i duasë së hapjes, kërkimi i mbrojtjes nga Allahu, thënia e bismilahit, thënia e aminit, leximi i një sureje pas Fatihasë", ], source: "Fiqh of Prayer", }, { topic: "prayer-rulings", ar: ["صلاة الجماعة أفضل من صلاة الفرد بسبع وعشرين درجة", "رواه البخاري ومسلم"], sv: ["Att be i församling är tjugosju gånger bättre än att be ensam", "Berättat av Bukhari och Muslim"], so: [ "Salaadda jamaacada waxay ka fadli badan tahay salaadda qofka keligiis ah toddoba iyo labaatan darajo", "Waxaa weriyay Bukhari iyo Muslim", ], sq: [ "Namazi me xhemat është njëzet e shtatë herë më i mirë se namazi individual", "Transmetuar nga Bukhari dhe Muslimi", ], source: "Bukhari & Muslim", }, { topic: "prayer-rulings", ar: ["من أدرك ركعة من الصلاة فقد أدرك الصلاة", "رواه البخاري ومسلم"], sv: ["Den som hinner med en raka av bönen har hunnit med bönen", "Berättat av Bukhari och Muslim"], so: ["Qofkii gaaray hal rakcad oo salaadda ah wuxuu gaaray salaadda", "Waxaa weriyay Bukhari iyo Muslim"], sq: ["Kush e arrin një rekat të namazit, e ka arritur namazin", "Transmetuar nga Bukhari dhe Muslimi"], source: "Bukhari & Muslim", }, { topic: "prayer-rulings", ar: ["إذا أقيمت الصلاة فلا صلاة إلا المكتوبة", "رواه مسلم"], sv: ["När bönen har inletts finns ingen bön utom den obligatoriska bönen", "Berättat av Muslim"], so: ["Marka la oogo salaadda, ma jirto salad aan ahayn tan la faralay", "Waxaa weriyay Muslim"], sq: ["Kur ngrihet namazi, nuk ka namaz përveç namazit farz", "Transmetuar nga Muslimi"], source: "Muslim", }, { topic: "prayer-rulings", ar: ["من نام عن صلاة أو نسيها فليصلها إذا ذكرها، لا كفارة لها إلا ذلك", "رواه البخاري ومسلم"], sv: [ "Den som sover genom en bön eller glömmer den ska be den när han kommer ihåg den. Det finns ingen annan gottgörelse för den än det", "Berättat av Bukhari och Muslim", ], so: [ "Qofkii seexda salaad ama illaawa, ha tukado markuu xasuusto, ma jirto kafaaro aan ahayn taas", "Waxaa weriyay Bukhari iyo Muslim", ], sq: [ "Kush fle gjumë gjatë një namazi ose e harron atë, le ta falë kur ta kujtojë. Nuk ka shpagim tjetër për të përveç kësaj", "Transmetuar nga Bukhari dhe Muslimi", ], source: "Bukhari & Muslim", }, { topic: "prayer-rulings", ar: ["لا تصح صلاة بغير طهور", "رواه مسلم"], sv: ["En bön utan renhet är inte giltig", "Berättat av Muslim"], so: ["Ma ansaxdo salad aan lahayn daahirnimo", "Waxaa weriyay Muslim"], sq: ["Nuk është i vlefshëm namazi pa pastërti", "Transmetuar nga Muslimi"], source: "Muslim", }, ] // Update the component definition export function IslamicTeachings({ textSpeed = 8, languages = { arabic: true, swedish: true, somali: true, albanian: true }, }: IslamicTeachingsProps) { const [currentTeachingIndex, setCurrentTeachingIndex] = useState(0) const [currentLanguage, setCurrentLanguage] = useState>("ar") const [currentPartIndex, setCurrentPartIndex] = useState(0) const [currentTopic, setCurrentTopic] = useState<"charity" | "prayer" | "prayer-rulings">("charity") // Use refs to maintain interval references const partIntervalRef = useRef(null) const isComponentMounted = useRef(true) // Update topic based on day useEffect(() => { const today = new Date() const dayOfMonth = today.getDate() // Rotate topics based on day of month if (dayOfMonth % 3 === 0) { setCurrentTopic("charity") } else if (dayOfMonth % 3 === 1) { setCurrentTopic("prayer") } else { setCurrentTopic("prayer-rulings") } return () => { isComponentMounted.current = false } }, []) // Filter languages based on settings const getEnabledLanguages = (): (keyof Omit)[] => { const enabled: (keyof Omit)[] = [] if (languages.arabic) enabled.push("ar") if (languages.swedish) enabled.push("sv") if (languages.somali) enabled.push("so") if (languages.albanian) enabled.push("sq") return enabled.length > 0 ? enabled : ["ar"] // Fallback to Arabic if nothing selected } // Update the content rotation with improved interval management useEffect(() => { // Clear any existing interval if (partIntervalRef.current) { clearInterval(partIntervalRef.current) } const rotateContent = () => { if (!isComponentMounted.current) return const filteredTeachings = islamicTeachings.filter((teaching) => teaching.topic === currentTopic) if (filteredTeachings.length === 0) return const currentTeaching = filteredTeachings[currentTeachingIndex % filteredTeachings.length] const enabledLanguages = getEnabledLanguages() // If current language is not in enabled languages, reset to first enabled language if (!enabledLanguages.includes(currentLanguage)) { setCurrentLanguage(enabledLanguages[0]) setCurrentPartIndex(0) return } const parts = currentTeaching[currentLanguage] if (currentPartIndex < parts.length - 1) { // Move to next part of the current teaching in the same language setCurrentPartIndex(currentPartIndex + 1) } else { // Current part is the last part, move to next language or teaching const currentLangIndex = enabledLanguages.indexOf(currentLanguage) const nextLangIndex = (currentLangIndex + 1) % enabledLanguages.length if (nextLangIndex <= currentLangIndex) { // We've gone through all languages, move to next teaching const nextTeachingIndex = (currentTeachingIndex + 1) % filteredTeachings.length setCurrentTeachingIndex(nextTeachingIndex) } // Move to next language and reset part index setCurrentLanguage(enabledLanguages[nextLangIndex]) setCurrentPartIndex(0) } } // Set up the interval partIntervalRef.current = setInterval(rotateContent, textSpeed * 1000) // Clean up on unmount or when dependencies change return () => { if (partIntervalRef.current) { clearInterval(partIntervalRef.current) } } }, [currentTeachingIndex, currentLanguage, currentPartIndex, currentTopic, textSpeed, languages]) // Get the current teaching content const filteredTeachings = islamicTeachings.filter((teaching) => teaching.topic === currentTopic) // Handle edge cases if (filteredTeachings.length === 0) { return (

Loading Islamic teachings...

) } const currentTeaching = filteredTeachings[currentTeachingIndex % filteredTeachings.length] const enabledLanguages = getEnabledLanguages() // Ensure current language is valid const safeLanguage = enabledLanguages.includes(currentLanguage) ? currentLanguage : enabledLanguages[0] // Ensure current part index is valid const parts = currentTeaching[safeLanguage] const safePartIndex = Math.min(currentPartIndex, parts.length - 1) const text = parts[safePartIndex] const source = safePartIndex === parts.length - 1 ? currentTeaching.source : null // Get topic title for display const getTopicTitle = () => { switch (currentTopic) { case "charity": return "الصدقة - Charity" case "prayer": return "الصلاة - Prayer" case "prayer-rulings": return "أحكام الصلاة - Prayer Rulings" default: return "" } } return (

{getTopicTitle()} {source && `- ${source}`}

{text}

) } [V0_FILE]typescriptreact:file="components/keep-awake.tsx" isMerged="true" "use client" import { useEffect, useRef } from "react" export function KeepAwake() { const canvasRef = useRef(null) useEffect(() => { const canvas = canvasRef.current if (!canvas) return const ctx = canvas.getContext("2d") if (!ctx) return // Set canvas size canvas.width = 2 canvas.height = 2 // Function to draw a small dot that moves slightly const draw = () => { if (!ctx) return // Clear canvas ctx.clearRect(0, 0, canvas.width, canvas.height) // Draw a small dot with changing position const x = 1 + Math.sin(Date.now() / 1000) * 0.5 const y = 1 + Math.cos(Date.now() / 1000) * 0.5 ctx.fillStyle = `rgba(0, 0, 0, 0.01)` ctx.beginPath() ctx.arc(x, y, 0.5, 0, Math.PI * 2) ctx.fill() } // Run animation const interval = setInterval(draw, 1000) // Also try to prevent default screen timeout behaviors const preventSleep = () => { // Create and trigger a fake user interaction const event = new MouseEvent("mousemove", { view: window, bubbles: true, cancelable: true, clientX: Math.random() * window.innerWidth, clientY: Math.random() * window.innerHeight, }) document.dispatchEvent(event) } const sleepPreventionInterval = setInterval(preventSleep, 30000) // Every 30 seconds return () => { clearInterval(interval) clearInterval(sleepPreventionInterval) } }, []) return (

Prayer Times Display Admin

Athan for {prayerName}

Adhan for {prayerName}

{prayerName === "Jumu'ah" ? "JUMU'AH KHUTBAH" : "IQAMA"}

{prayerName === "Jumu'ah" ? "خطبة الجمعة" : `إقامة ${getPrayerArabicName(prayerName)}`}

Adkar After Adhan - أذكار بعد الأذان

Iqama

Prayer in Progress

Prayer Times

About

Tags

Share

About

Tags

Share

More Templates Like This